<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>个人信息personInfo.html</title>
	</head>
	<link rel="stylesheet" href="../css/common.css" />
	<link rel="stylesheet" href="../css/less/common_less.css" />
	<style>
		.newPlan{
			background:#ff7777;
		}
		.btnBox{
			width:1040px;
			text-align:center;
			margin-top:15px;
		}
		.addAir{
			width:1000px;
			padding-top:50px;
		}
		.addAir p{
		  	margin:0 auto;  
			color:#959ca2;
			width:310px;
			height:30px;
			margin-top:15px;
			line-height:30px;
			text-align:right;
		}
		.addAir p input[type=text]{
			width:200px;
			height:100%;
			margin-left:10px;
			border:1px solid #979ea6;
			border-radius:3px;
			padding-left:10px;
			font-family:"微软雅黑";
		}
		.addAir p input[type=radio]{
			position:relative;
			top:5px;
			right:5px;
			margin-left:15px;						
		}
		.sex{
			padding-right:265px;
		}
		.sure{
			width:100px;
		}
		select{
			height:25px;
			width:69px;
		}
		.deptP{
			position:relative;
			
		}
		.bumen{
			dispaly:inline-block;
			width:210px;
			padding-bottom:10px;
			position:absolute;
			left:92px;
			top:30px;
			border:1px solid #999;
			border-radius:2px;
			background:white;
			display:none;
			overflow-y:outo;
		}
		.bumen li{
			text-align:center;
			height:20px;	
			line-hegiht:20px;	
			cursor:pointer;		
		}
		.outerbg{
			background:white;
			margin:10px;
		}
	</style>
	<body>
	<div class="outerbg">
		<div class="addAir">
			<input style='display:none' class='userid' type='text'/>
			<p>用户名:<input class='userName' type="text" disabled /><strong style="color:red;">*</strong></p>
			<p>真实姓名:<input class='realName' disabled type="text"  /><strong style="color:red;">*</strong></p>
			<p class='sex'>性别:<input name='sex' type="radio" value='1'/>男<input name='sex' type="radio" value='2'/>女<strong style="color:#f1f1f1;">*</strong></p>
			<p>出生日期:<input class='bornDate datespicker' type='text' onclick="new WdatePicker({dateFmt:'yyyy-MM-dd'})"/><strong style="color:#f1f1f1;">*</strong></p>							
			<p>邮箱:<input class='email' type="text"  /><strong style="color:red;">*</strong></p>
			<p>手机:<input class='phone' type="text"  /><strong style="color:#f1f1f1;">*</strong></p>
			<p>座机:<input class='temphone' type="text"  /><strong style="color:#f1f1f1;">*</strong></p>
			<p class='deptP'>部门:<input readonly class='dept' type="text"  /><strong style="color:red;">*</strong><span class='bumen'></span></p>
			<span style='display:none;' class='bumenId'></span>
		</div>
		
		<div class='btnBox'>
			<button class='Dolo_btn sure'>确认</button>
		</div>
	</div>
		
	</body>
		<script type="text/javascript" src="../js/jquery-1.12.4.js" ></script>
		<script type="text/javascript" src="../layer-v2.4/layer/layer.js" ></script>
		<!-- 引入my97日期时间控件 -->
		<script type="text/javascript" src="../js/My97DatePicker/WdatePicker.js" charset="utf-8"></script>	
		<script type="text/javascript" src="../js/common.js" ></script>
		<script>
		/*中间白色区域部分高度的设置*/
		var height=$(document).height();
		$(".outerbg").height(height-20);
		//__________________________________________________________________渲染页面
			$.get("../User/getIdBySess?temp="+Math.random(),function(data){
				data = JSON.parse(data)
				console.log(data)
				$(".userid").val(data.data.id)
				$(".userName").val(data.data.loginname);
				$(".realName").val(data.data.name);
				$(".bornDate").val(data.data.birthday);
				if(data.data.sex=="1"){
					$("input[value=1]").prop("checked",true)
				}
				if(data.data.sex=="2"){
					$("input[value=2]").prop("checked",true)
				}
				$(".email").val(data.data.email);
				$(".phone").val(data.data.phone);
				$(".temphone").val(data.data.tel);
				$(".dept").val(data.data.organizationName);
				$(".bumenId").text(data.data.organizationId);
			})
			
			var onOff = true;
			$(".dept").click(function(){
				if(onOff){
					$(".bumen").show(500)
					onOff=!onOff
				}else{
					$(".bumen").hide(500)
					onOff=!onOff
				}
				
				$.ajax({									
					type:"get",
					url:"../User?temp="+Math.random(),
					dataType:"json",
					success:function(data){
						$(".bumen").empty();
						console.log(data)
						var str="";
						for(var i=0;i<data.data.length;i++){
							str+="<li class='bumenName'><span class=li1>"+data.data[i].name+"</span><span style='display:none;' class='li2'>"+data.data[i].id+"</span></li>"
						}
						$(".bumen").append(str)
					}											
				})
				$(".bumen").delegate(".bumenName","click",function(){
					var index = $(this).index()
					$(".dept").val($(".li1").eq(index).text())	
					$(".bumenId").text($(this).find("span[class=li2]").text())
					$(".bumen").hide(500)	
				})
				
				
				
				
			})
			
			
		//__________________________________________________________________提交数据
			$(".sure").click(function(){
				var submitMess = {};
				submitMess.id = $(".userid").val()
				submitMess.loginname = $(".userName").val();
				submitMess.name = $(".realName").val();
				submitMess.sex = $("input[type=radio]:checked").val();
				submitMess.birthday = $(".bornDate").val();
				submitMess.email = $(".email").val();
				submitMess.phone = $(".phone").val();
				submitMess.tel = $(".temphone").val();
				submitMess.organizationId = $(".bumenId").text();
				layer.msg('提交中...', {icon: 16,shade: 0.01});
			
				$.ajax({
					type:"post",
					url:"../User/editper?temp="+Math.random(),
					contentType:'application/json;charset=utf-8',
					async:true,
					data:JSON.stringify(submitMess),
					success:function(data){
						data=JSON.parse(data)
						if(data.status=="1001"){
							layer.msg('个人信息提交成功', {icon: 1,time:1000},function(){
								
							})	
						}if(data.status=="1002"){
							layer.msg("个人信息提交失败,"+data.message,{icon: 2,time:2000},function(){
								
							})
						}
					}					
				});			
			})
		</script>					
</html>
